export default class akCanvasTool {

  constructor(res) {
    const {
      width,
      height,
      node
    } = res;

    this.node = node;
    // Canvas 绘制上下文
    this.ctx = node.getContext('2d');

    // Canvas 画布的实际绘制宽高
    const renderWidth = width
    const renderHeight = height

    // 初始化画布大小
    const dpr = wx.getWindowInfo().pixelRatio
    node.width = renderWidth * dpr
    node.height = renderHeight * dpr
    this.ctx.scale(dpr, dpr)


    this.taskList = [];
    this.addTask = (fun) => this.taskList.push(fun);
  }

  fillRect(x, y, w, h) {
    this.addTask(() => this.ctx.fillRect(x, y, w, h));
  }

  stroke() {
    this.addTask(() => this.ctx.stroke());
  }

  fill() {
    this.addTask(() => this.ctx.fill());
  }

  setFillStyle(color) {
    this.addTask(() => this.ctx.fillStyle = color);
  }

  setStrokeStyle(color) {
    this.addTask(() => this.ctx.strokeStyle = color);
  }

  beginPath() {
    this.addTask(() => this.ctx.beginPath());
  }

  moveTo(x, y) {
    this.addTask(() => this.ctx.moveTo(x, y));
  }

  lineTo(x, y) {
    this.addTask(() => this.ctx.lineTo(x, y));
  }

  setTextAlign(value) {
    this.addTask(() => this.ctx.textAlign = value);
  }

  setTextBaseline(value) {
    this.addTask(() => this.ctx.textBaseline = value);
  }

  setFontSize(value) {
    this.ctx.font = value + "px sans-serif"
    this.addTask(() => this.ctx.font = value + "px sans-serif");
  }
  fillText(text, x, y, maxWidth) {
    this.addTask(() => this.ctx.fillText(text, x, y, maxWidth));
  }
  measureText(text) {
    return this.ctx.measureText(text)
  }

  arc(x, y, radius, startAngle, endAngle) {
    this.addTask(() => this.ctx.arc(x, y, radius, startAngle, endAngle));
  }


  bezierCurveTo(cp1x, cp1y, cp2x, cp2y, cp3x, cp4y) {
    this.addTask(() => this.ctx.bezierCurveTo(cp1x, cp1y, cp2x, cp2y, cp3x, cp4y));
  }

  async draw(noClear, success) {
    if (!noClear) {
      let canvas = this.ctx.canvas;
      this.ctx.clearRect(0, 0, canvas.width, canvas.height);
    }
    for (let t of this.taskList) {
      await t()
    }
    this.taskList.length = 0;
    if (typeof success == 'function') success();
  }

  setShadow(offsetX, offsetY, blur, color) {
    this.addTask(() => {
      if (offsetX != undefined) this.ctx.shadowOffsetX = offsetX;
      if (offsetY != undefined) this.ctx.shadowOffsetX = offsetY;
      if (blur != undefined) this.ctx.shadowBlur = blur;
      if (color != undefined) this.ctx.shadowColor = color;
    });
  }

  clearRect(x, y, w, h) {
    this.addTask(() => this.ctx.clearRect(x, y, w, h));
  }

  drawImage(url, x = 0, y = 0, w = 50, h = 50) {
    this.addTask(() => {
      return new Promise((resolve) => {
        const img = this.node.createImage()
        img.src = url
        img.onload = (res) => {
          this.ctx.drawImage(img, x, y, w, h)
          // this.drawCar(img,ctx,0,0,item.width,item.height)
          resolve()
        }
      })
    })
  }
  closePath() {
    this.ctx.closePath()
  }
  save() {
    this.ctx.save()
  }
  clip() {
    this.ctx.clip()
  }
  restore() {
    this.ctx.restore()
  }


  /**
   * 绘制圆角矩形
   * @param {Object} ctx - canvas组件的绘图上下文
   * @param {Number} x - 矩形的x坐标
   * @param {Number} y - 矩形的y坐标
   * @param {Number} w - 矩形的宽度
   * @param {Number} h - 矩形的高度
   * @param {Number} r - 矩形的圆角半径
   * @param {String} [c = 'transparent'] - 矩形的填充色
   */
  roundRect(x, y, w, h, r, c = '#fff') {
    this.addTask(() => {
      if (w < 2 * r) {
        r = w / 2;
      }
      if (h < 2 * r) {
        r = h / 2;
      }
      const ctx = this.ctx
      ctx.beginPath();
      ctx.fillStyle = c;

      ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);
      ctx.moveTo(x + r, y);
      ctx.lineTo(x + w - r, y);
      ctx.lineTo(x + w, y + r);

      ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);
      ctx.lineTo(x + w, y + h - r);
      ctx.lineTo(x + w - r, y + h);

      ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);
      ctx.lineTo(x + r, y + h);
      ctx.lineTo(x, y + h - r);

      ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);
      ctx.lineTo(x, y + r);
      ctx.lineTo(x + r, y);

      ctx.fill();
      ctx.closePath();
    });
  }

  //更多调用方法...
}